<template>
  <div class="myTop">
    <div class="left">
      <navigator url="/pages/login/login">
        <div class="navTo">
          <router-link to="/login">
            <van-icon name="manager-o" color="#AAAAAA" size="40px" />
          </router-link>
        </div>
      </navigator>
      <div class="name" @click="gos">
        <div>昵称：{{ name }}</div>
        <div>个性签名：{{ nickname }}</div>
      </div>
    </div>
    <div class="ringht"></div>
    <img src="../../imags/wodebeijing.png" alt="" />
  </div>
  <van-cell @click="go" title="我的订单" is-link />
  <van-grid :border="false">
    <van-grid-item icon="paid" text="待付款" />
    <van-grid-item icon="free-postage" text="待发货" />
    <van-grid-item icon="logistics" text="待收货" />
    <van-grid-item icon="good-job-o" text="待评价" />
  </van-grid>
  <van-cell is-link>
    <view slot="title" style="display: flex">
      <van-icon
        slot="l-icon"
        name="balance-o"
        color="rgb(245,148,71)"
        size="20px"
      />
      <view class="van-cell-text">账户余额</view>
    </view>
  </van-cell>
  <van-cell is-link>
    <view slot="title" style="display: flex">
      <van-icon
        slot="l-icon"
        name="video-o"
        color="rgb(143,165,244)"
        size="20px"
      />
      <view class="van-cell-text">推广中心</view>
    </view>
  </van-cell>
  <van-cell is-link>
    <view slot="title" style="display: flex">
      <van-icon
        slot="l-icon"
        name="star-o"
        color="rgb(245,148,71)"
        size="20px"
      />
      <view class="van-cell-text">我的收藏</view>
    </view>
  </van-cell>
  <van-cell is-link>
    <view slot="title" style="display: flex">
      <van-icon
        slot="l-icon"
        name="manager-o"
        color="rgb(190,164,254)"
        size="20px"
      />
      <view class="van-cell-text">关于我们</view>
    </view>
  </van-cell>
  <van-cell is-link @click="address">
    <view slot="title" style="display: flex">
      <van-icon
        slot="l-icon"
        name="balance-o"
        color="rgb(246,120,120)"
        size="20px"
      />
      <view class="van-cell-text">地址管理</view>
    </view>
  </van-cell>
  <van-cell is-link to="/my/setup">
    <view slot="title" style="display: flex">
      <van-icon
        slot="l-icon"
        name="setting-o"
        color="rgb(121,206,254)"
        size="20px"
      />
      <view class="van-cell-text">设置</view>
    </view>
  </van-cell>
</template>
<script setup>
import { ref, toRefs } from "vue";
import { useRoute } from "vue-router";
import userUserStore from "@/stores/user";
import { useRouter } from "vue-router";
const router = useRouter();
const go = () => {
  router.push({
    name: "order",
  });
};
const gos = () => {
  router.push({
    name: "name",
  });
};
const address = () => {
  router.push({
    name: "manage",
  });
};
const { name, nickname } = userUserStore();
console.log(name);
</script>
<style>
.myTop {
  margin-top: 70px;
  margin-bottom: 20px;
}
.myTop .left img {
  width: 30px;
  height: 30px;
}
.myTop img {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: -1;
}
.navTo {
  width: 74px;
  height: 74px;
  text-align: center;
  line-height: 80px;
  border-radius: 50%;
  background-color: #dddddd;
  margin-right: 16px;
  margin-left: 16px;
}
.left {
  display: flex;
  align-items: center;
}
.name view {
  color: white;
}
.name view:nth-child(1) {
  margin-top: 10px;
  font-size: 16px;
}
.name view:nth-child(2) {
  margin-top: 10px;
  font-size: 13px;
}
.van-icon {
  margin-right: 10px;
}
</style>
